<template>
  <div>
    <el-dialog
      v-el-drag-dialog
      title="批量审核"
      :visible.sync="visible"
      width="400px"
      @closed="reset"
    >
      <div class="page">
        <el-form ref="dataForm" class="form" :rules="rules" :model="temp" label-position="left" label-width="100px">
          <el-form-item label="调拨车辆" prop="carNumber">
            <el-select v-model="temp.carNumber" filterable placeholder="请选择" clearable @change="truckChange">
              <el-option
                v-for="item in truckMap"
                :key="item.truckId"
                :label="item.truckCode"
                :value="item.truckId"
              />
            </el-select>
          </el-form-item>

          <el-form-item label="司机" prop="driverId">
            <el-select v-model="temp.driverId" filterable placeholder="请选择" clearable @change="driverChange">
              <el-option
                v-for="item in driverMap"
                :key="item.userId"
                :label="item.userName"
                :value="item.userId"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="押运员:" prop="escortId">
            <el-select v-model="temp.escortId" filterable placeholder="请选择" clearable @change="escortChange">
              <el-option
                v-for="item in escortMap"
                :key="item.userId"
                :label="item.userName"
                :value="item.userId"
              />
            </el-select>
          </el-form-item>
        </el-form>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="pass(2)">通过</el-button>
        <el-button type="danger" @click="rejectWin">驳回</el-button>
        <el-button @click="visible=false">关闭</el-button>
      </div>
    </el-dialog>
    <cancellation-cause ref="cancellationCause" @upDataCause="upDataCause" />
  </div>
</template>

<script>
  import { stockTransAudit } from '@/api'
  import { formatColumnMap, parseTime } from '@/utils'
  import CancellationCause from './CancellationCause.vue'

  export default {
    components: {
      CancellationCause
    },
    props: {
      truckMap: {
        type: Array,
        required: true
      },
      driverMap: {
        type: Array,
        required: true
      },
      escortMap: {
        type: Array,
        required: true
      }
    },
    data() {
      return {
        visible: false,
        formatColumnMap, parseTime,
        temp: {
          carNumber: '',
          driverId: '',
          escortId: ''
        },
        rules: {
          carNumber: [{ required: true, message: '请选择调拨车辆', trigger: 'change' }],
          driverId: [{ required: true, message: '请选择司机', trigger: 'change' }]
        },
        selectList: []
      }
    },
    computed: {
    },
    watch: {

    },
    mounted() {

    },
    destroyed() {

    },
    methods: {
      open(selectList) {
        return new Promise(resolve => {
          this.resolve = resolve
          if (selectList) {
            console.log(selectList)
            this.selectList = selectList
            const codes = this.selectList.map(item => {
              return item.stockTransCode
            })
            this.temp = {
              ...this.temp,
              stockTransCodes: codes.join(',')
            }
          }
          this.visible = true
        })
      },
      // 车辆参数处理
      truckChange(val) {
        const arr = this.truckMap.find((l) => l.truckId === val)
        this.$set(this.temp, 'carNumber', arr.truckCode)
      },
      // 处理司机
      driverChange(val) {
        if (val) {
          const arr = this.driverMap.find((l) => l.userId === val)
          this.$set(this.temp, 'driver', arr.userName)
          this.$set(this.temp, 'driverId', arr.userId)
        } else {
          this.$set(this.temp, 'driver', '')
          this.$set(this.temp, 'driverId', '')
        }
      },
      // 押运员
      escortChange(val) {
        if (!val) {
          return
        }
        const arr = this.escortMap.find((l) => l.userId === val)
        this.$set(this.temp, 'escort', arr.userName)
        this.$set(this.temp, 'escortId', arr.userId)
      },
      // 通过
      async pass(transStatus) {
        this.$refs.dataForm.validate(valid => {
          if (!valid) return

          this.submit({
            ...this.temp,
            transStatus: transStatus
          })
        })
      },
      async submit(params) {
        console.log('params', params)
        delete params.stockTransCode
        const res = await stockTransAudit(params)
        if (res.status === 200) {
          this.$notify({
            title: '提示',
            message: '操作成功',
            type: 'success',
            duration: 2000
          })
          this.visible = false
          this.resolve(true)
          // this.$emit('upDataTable')
        } else {
          this.$message.warning(res.data.message)
          this.resolve(false)
        }
      },
      // 更新数据
      upDataCause() {
        this.$emit('upDataTable')
        this.visible = false
      },
      // 驳回
      rejectWin() {
        this.$refs.cancellationCause.open(this.temp)
      },
      reset() {
        this.temp = {
          carNumber: '',
          driverId: '',
          escortId: ''
        }
      }
    }
  }
</script>

<style lang='scss' scoped>

</style>
